import $ from 'jquery';
var current = {};
var proxy = {};
export function dragUtil(componentModel) {
	$("#" + componentModel.id).bind('mousedown.drag', function(e) {
		$(document).bind("selectstart.drag", function () { return false; });
		var target = $(this);
		proxy = $("<div class='l-draggable'></div>");
		proxy.width(target.width()).height(target.height());
		proxy.appendTo("body");
		current = {
			target: target,
			left: target.offset().left,
			top: target.offset().top,
			startX: e.pageX || e.screenX,
			startY: e.pageY || e.clientY
		};
		proxy.css("cursor", "move");

		$(document).bind('mousemove.drag', function() {
			
		});
		$(document).bind('mouseup.drag', function(e) {
			var x= e.pageX || e.screenX;
			var y= e.pageY || e.clientY;
			var top=current.top+(y-current.startY);
			console.log("top="+top);
			$("#"+componentModel.id).css({"top":current.top+(y-current.startY),"left":current.left+(x-current.startX)});
			proxy.remove();
			$(document).unbind('mousemove.drag');
		});
	});
}
